<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
 <%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<script type="text/javascript" src="<%=basePath%>Js/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="<%=basePath%>css/mycss/bootstrap.min.css" />
        <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
		<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
		<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<head>
<meta charset="UTF-8">
</head>
<script type="text/javascript">

//通过房间号查询房间动态
function selectRoomByNumber(){
	var roomNumber = $("#roomNumber").val();
	if (!(/(^[0-9]*[1-9][0-9]*$)/.test(roomNumber))){
		alert("你的输入带有字符");
	}else{
		$.ajax({
			type:"post",
			url:"selectRoomByNumber.do",
			data:{
				"roomNumber":roomNumber,
			},
			success:function(result){
				stus = JSON.parse(result)
				for(var i = 0; i < stus.length; i++ ){
					var stu = "";
					stu += "<tr><th>房间号</th><th>楼层</th><th>价格</th><th>房型</th> <th>状态</th><th>容纳人数</th><th>备注</th></tr>";
					stu += "<tr><td>"+stus[i].roomnum+"</td><td>"+stus[i].floor+"</td><td>"+stus[i].price+"</td>";
					stu += "<td>"+stus[i].type+"</td> <td>"+stus[i].status+"</td><td>"+stus[i].quantity+"</td><td>"+stus[i].remark+"</td></tr>";
					
					$("#page1").remove();
					$("#roomTable").empty();
					$("#roomTable").html(stu);
				}
				
			},
			error:function(){
				
			}
		})
	}
}

//通过楼层、房间动态、房型条件查询房间信息
function selectRoomByother(){
	
	var floor = $("#floor").find("option:selected").text();
	var state = $("#state").find("option:selected").text();
	var houseType = $("#houseType").find("option:selected").text();
	
	if(floor =="默认" && state=="默认" && houseType=="默认"){
		window.location.href="queryRoom.do";
	}else{
		window.location.href="selectRoomByother.do?floor="+floor+"&state="+state+"&houseType="+houseType;
	}
	
	

}

//刷新
function refreshPage(){
	window.location.href="queryRoom.do";
}


//模态框显示
function queryResidentInf(number,judge){
	$.ajax({
		type:"post",
		url:"selectvipByNumber2.do",
		data:{
			"number":number,
		},
		success:function(result){
        stus = JSON.parse(result)
			
			var str = "";
			for(var i = 0; i < stus.length; i++ ){
				
				str +="<table id='stafTble' border='5px' cellspacing='5px' bordercolor='blue' width='570px' height='50px'>";
				str +="<tr><td width='30%' class='tableleft'>卡号</td>"
				str +="<td><input disabled='disabled' type='text' name='stafNumber' value="+stus[i].number+" id='stafNumber2' class='form-control' style='width:100%' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>姓名</td>"
				str +="<td><input disabled='disabled' type='text' name='stafName' value="+stus[i].name+" id='stafName2' class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>性别</td>"
				str +="<td><input disabled='disabled' type='text' name='product' id='stafIdNumber2' value="+stus[i].gender+" class='form-control' style='width:100%'/></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>年龄</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='staAddress2' value="+stus[i].age+" class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>出生年月日</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='stafJobtitle2' value="+stus[i].reserved1+" class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>会员等级</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='stafGender2' value="+stus[i].grade+" class='form-control' style='width:100%' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>身份证号</td>"
				str +="<td><input disabled='disabled'  type='text' name='classify' id='stafAge2' value="+stus[i].idnumber+" class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>居住地址</td>"
				str +="<td><input disabled='disabled' type='text' name='classify' id='stafJurisdiction2' value="+stus[i].address+" class='form-control' style='width:100%'' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>电话号码</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='stafWorktime2' value="+stus[i].phone+" class='form-control' style='width:100%'' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>余额</td>"
				str +="	<td><input disabled='disabled' type='text' name='stafHiredate' id='stafHiredate2' value="+stus[i].money+"￥ class='form-control' style='width:100%'' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>备注</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='stafPhone2' value="+stus[i].remark+" class='form-control' style='width:100%'' /></td></tr>"
				str +="</table>"

			}
			if(judge == 1){
				stu = "<h3 class='modal-title'  align='center'>入住人详细信息</h3>";
			}else{
				stu = "<h3 class='modal-title'  align='center'>预约人详细信息</h3>";
			}
			
			$("#myModalLabel").empty( );
			$("#Inf").empty( );
			$("#Dirtyroom").empty( );
			$("#Inf").html(str);
			$("#myModalLabel").html(stu);
		},
		error:function(){
			alert("系统故障");
		}
	})
}

function selectDirtyroom(roomNumber,floor,price,type){
	var str = "";
	str +="<table id='stafTble' border='5px' cellspacing='5px' bordercolor='blue' width='570px' height='50px'>";
	str +="<tr><td width='30%' class='tableleft'>房间号</td>"
	str +="<td><input disabled='disabled' type='text' name='stafNumber' value="+roomNumber+" id='roomNumber2' class='form-control' style='width:100%' /></td></tr>"
	str +="	<tr><td width='30%' class='tableleft'>楼层</td>"
	str +="<td><input disabled='disabled' type='text' name='stafName' value="+floor+" id='floor' class='form-control' style='width:100%' /></td></tr>"
	str +="<tr><td width='30%' class='tableleft'>价格</td>"
	str +="<td><input disabled='disabled' type='text' name='product' id='price' value="+price+" class='form-control' style='width:100%'/></td></tr>"
	str +="<tr><td width='30%' class='tableleft'>房型</td>"
	str +="	<td><input disabled='disabled' type='text' name='classify' id='type' value="+type+" class='form-control' style='width:100%' /></td></tr>"
	
	var stu = "<h3 class='modal-title'  align='center'>脏房清洁</h3>";
	var stu2 = "<button type='button' onclick='Dirtyroom()' class='btn btn-success'>清理脏房</button>"
	$("#myModalLabel").empty( );
	$("#Inf").empty( );
	$("#Inf").html(str);
	$("#myModalLabel").html(stu);
	$("#Dirtyroom").html(stu2);
}

function Dirtyroom(){
	
	var roomNumber = $("#roomNumber2").val();
	$.ajax({
		type:"post",
		url:"Dirtyroom.do",
		data:{
			"roomNumber":roomNumber,
		},
		dataType:"text",
		success:function(result){
			if(result == "1"){
				alert("已确定清理脏房")
			}else{
				alert("操作失败")
			}
		},
		error:function(){
			alert("系统故障")
		}
	})
	
}

//取消预约
function cancelSubscribe(roomNumber){
	
	if(confirm("是否确定取消预约")){
	$.ajax({
		type:"post",
		url:"cancelSubscribe.do",
		async: false,
		data:{
			"roomNumber":roomNumber,
		},
		dataType:"text",
		success:function(result){
			if(result == "1"){
				alert("取消预约成功")
			}else{
				alert("取消预约失败")
			}
		},
		error:function(){
			alert("系统故障")
		}
	})
	
	}
}

</script>

<body>

<h3 align="center">客房动态查询</h3>

<table >
<tr><td><input type="text" name="roomNumber" id="roomNumber" class="form-control" placeholder="请输入房间号" value=""></td>
<td>&nbsp;&nbsp;<button class="btn btn-primary" onclick="selectRoomByNumber()">查询</button>&nbsp;&nbsp; </td>
</tr>
</table>
  <br>
<div>


		<table>
			<tr>
			<td>选择楼层：</td>	
				<td>
                <select name="floor" id="floor" class="form-control">

						<option value="0">默认</option>
						<c:forEach items="${floorlist}" var="floorlist">

						<option value="1">${floorlist.floor}</option>
						</c:forEach>

				</select>
				</td>
				
				<td>状态选择：</td>	
				<td>&nbsp;&nbsp;
				<select name="state" id="state" class="form-control">
				
				  <option >默认</option>
	
	              <option >已预约</option>

		          <option >使用中</option>

		          <option >空闲</option>
		          
		          <option >脏房</option>
	           </select><br> 
				</td>
				
				<td>选择房型：</td>	
					<td>&nbsp;&nbsp;
				<select name="houseType" id="houseType" class="form-control">
				
				  <option value="0">默认</option>
				  
				  <c:forEach items="${houselist}" var="list">
	              <option value="0">${list.housetype}</option>
	              </c:forEach>
	           </select><br> 
				</td>
				
				<td>&nbsp;&nbsp;<button class="btn btn-primary" onclick="selectRoomByother()">查询</button>&nbsp;&nbsp; </td>
				<td>&nbsp;&nbsp;<button class="btn btn-success" onclick="refreshPage()">刷新</button>&nbsp;&nbsp; </td>
			</tr>
		</table>
		  
    
</div><br>

	<table class="table table-hover" id="roomTable">

		<tr>
			<th>房间号</th>
			<th>楼层</th>
			<th>价格</th>
			<th>房型</th>
			<th>状态</th>
			<th>容纳人数</th>
			<th>备注</th>
			<th>操作</th>
		</tr>
		<c:forEach items="${pageInfo.list}" var="roomlist">

			<tr>
				<td>${roomlist.roomnum}</td>
				<td>${roomlist.floor}</td>
				<td>${roomlist.price}</td>
				<td>${roomlist.type}</td>
				<c:choose>
				<c:when test="${roomlist.status =='使用中'}">
				<td style="color:#F00">${roomlist.status}</td>
				</c:when>
				<c:when test="${roomlist.status =='脏房'}">
				<td style="color:#F00">${roomlist.status}</td>
				</c:when>
				<c:when test="${roomlist.status =='已预约'}">
				<td style="color:#F89406">${roomlist.status}</td>
				</c:when>
				<c:otherwise>
				<td style="color:#3E8F3E">${roomlist.status}</td>
				</c:otherwise>
				</c:choose>
				
				<td>${roomlist.quantity}</td>
				<td>${roomlist.remark}</td>
				
				<c:choose>
				<c:when test="${roomlist.status =='使用中'}">
				<td><a href="" data-toggle="modal" data-target="#myModal"
							onclick="queryResidentInf('${roomlist.reserved2}',1)">查看住户信息</a>
							</td>
				</c:when>
				<c:when test="${roomlist.status =='脏房'}">
				<td>
				<a href="" data-toggle="modal" data-target="#myModal"
							onclick="selectDirtyroom('${roomlist.roomnum}','${roomlist.floor}','${roomlist.price}','${roomlist.type}')">脏房清洁</a>
				</td>
				</c:when>
				<c:when test="${roomlist.status =='已预约'}">
				<td><a href="" data-toggle="modal" data-target="#myModal"
							onclick="queryResidentInf('${roomlist.reserved2}',2)">查看预约人信息</a>
				<a href="" onclick="cancelSubscribe('${roomlist.roomnum}')">取消预约</a>
				</td>
				</c:when>
				<c:otherwise>
				<td></td>
				</c:otherwise>
				</c:choose>		
					
			</tr>

		</c:forEach>
	</table>

	<c:if test="${inf eq null}">
		<div id="page1">
	<c:if test="${!pageInfo.isFirstPage && !empty pageInfo}">
					<a href="${pageContext.request.contextPath }/queryRoom.do">首页</a>
					<a href="${pageContext.request.contextPath }/queryRoom.do?pageNum=${pageInfo.prePage}">上一页</a>
				</c:if>
				<c:if test="${!pageInfo.isLastPage }">
				<a href="${pageContext.request.contextPath }/queryRoom.do?pageNum=${pageInfo.nextPage}">下一页</a>
				<a href="${pageContext.request.contextPath }/queryRoom.do?pageNum=${pageInfo.lastPage}">末页</a>
				</c:if>
				当前页：${pageInfo.pageNum }/${pageInfo.pages }.
				</div>
				</c:if>
				
		<c:if test="${!(inf eq null)}">
		<div id="page1">
	<c:if test="${!pageInfo.isFirstPage && !empty pageInfo}">
					<a href="${pageContext.request.contextPath }/selectRoomByother.do?floor=${floor}&state=${state}&houseType=${houseType}">首页</a>
					<a href="${pageContext.request.contextPath }/selectRoomByother.do?pageNum=${pageInfo.prePage}&floor=${floor}&state=${state}&houseType=${houseType}">上一页</a>
				</c:if>
				<c:if test="${!pageInfo.isLastPage }">
				<a href="${pageContext.request.contextPath }/selectRoomByother.do?pageNum=${pageInfo.nextPage}&floor=${floor}&state=${state}&houseType=${houseType}">下一页</a>
				<a href="${pageContext.request.contextPath }/selectRoomByother.do?pageNum=${pageInfo.lastPage}&floor=${floor}&state=${state}&houseType=${houseType}">末页</a>
				</c:if>
				当前页：${pageInfo.pageNum }/${pageInfo.pages }.
				</div>
				</c:if>
				
				
				
	
						<!-- 模态框（Modal） -->
		<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
							&times;
						</button>
					</div>
					<div id="myModalLabel">
					
					</div>
					<div class="modal-body" id="Inf">
						
					</div>
				
					   <div class="modal-footer">
					   <span id="Dirtyroom"></span>
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭
						</button>
					</div>
				</div><!-- /.modal-content -->
			</div><!-- /.modal -->
		</div>

                  

</body>
</html>